diff --git a/swh/web/common/swh_templatetags.py b/swh/web/common/swh_templatetags.py
index 0cdcbee71..43ca39411 100644
--- a/swh/web/common/swh_templatetags.py
+++ b/swh/web/common/swh_templatetags.py
@@ -1,92 +1,82 @@
 # Copyright (C) 2017  The Software Heritage developers
 # See the AUTHORS file at the top-level directory of this distribution
 # License: GNU General Public License version 3, or any later version
 # See top-level LICENSE file for more information
 
 import re
 
 from docutils.core import publish_parts
 from docutils.writers.html4css1 import Writer, HTMLTranslator
 from inspect import cleandoc
 
 from django import template
-from django.utils.safestring import mark_safe
-
-from pygments import highlight
-from pygments.lexers import JsonLexer
-from pygments.formatters import HtmlFormatter
 
 register = template.Library()
 
 
 class NoHeaderHTMLTranslator(HTMLTranslator):
     """
     Docutils translator subclass to customize the generation of HTML
     from reST-formatted docstrings
     """
     def __init__(self, document):
         super().__init__(document)
         self.body_prefix = []
         self.body_suffix = []
 
     def visit_bullet_list(self, node):
         self.context.append((self.compact_simple, self.compact_p))
         self.compact_p = None
         self.compact_simple = self.is_compactable(node)
         self.body.append(self.starttag(node, 'ul', CLASS='docstring'))
 
 
 DOCSTRING_WRITER = Writer()
 DOCSTRING_WRITER.translator_class = NoHeaderHTMLTranslator
 
 
 @register.filter
 def safe_docstring_display(docstring):
     """
     Utility function to htmlize reST-formatted documentation in browsable
     api.
     """
     docstring = cleandoc(docstring)
     return publish_parts(docstring, writer=DOCSTRING_WRITER)['html_body']
 
 
 @register.filter
 def urlize_api_links(text):
     """Utility function for decorating api links in browsable api.
 
     Args:
         text: whose content matching links should be transformed into
         contextual API or Browse html links.
 
     Returns
         The text transformed if any link is found.
         The text as is otherwise.
 
     """
     text = re.sub(r'(/api/[^"<]*/|/browse/.*/|http.*$)',
                   r'<a href="\1">\1</a>',
                   text)
     return re.sub(r'([^ <>"]+@[^ <>"]+)',
                   r'<a href="mailto:\1">\1</a>',
                   text)
 
 
 @register.filter
 def urlize_header_links(text):
     """Utility function for decorating headers links in browsable api.
 
     Args
         text: Text whose content contains Link header value
 
     Returns:
         The text transformed with html link if any link is found.
         The text as is otherwise.
 
     """
     return re.sub(r'<(/api/.*|/browse/.*)>', r'<<a href="\1">\1</a>>',
                   text)
-
-
-@register.filter
-def highlight_json(text):
-    return mark_safe(highlight(text, JsonLexer(), HtmlFormatter()))
diff --git a/swh/web/templates/apidoc.html b/swh/web/templates/apidoc.html
index 07cd69e60..55d9ae11b 100644
--- a/swh/web/templates/apidoc.html
+++ b/swh/web/templates/apidoc.html
@@ -1,139 +1,149 @@
 {% extends "layout.html" %}
 {% load swh_templatetags %}
+{% load static %}
 {% block title %}{{ heading }} &ndash; Software Heritage API {% endblock %}
+{% block header %}
+<script src="{% static 'js/highlightjs/dist/highlight.pack.js' %}"></script>
+<script>
+  hljs.initHighlightingOnLoad();
+</script>
+<link rel="stylesheet" href="{% static 'css/highlightjs/github.css' %}">  
+{% endblock %}
 {% block content %}
 <nav class="bread-crumbs">
   <ul>
     <li><a href="/api/">API</a></li>
     <li>/</li>
     <li><a href="/api/1/">endpoints</a></li>
     <li>/</li>
     <li>{{ request.path }}</li>
   </ul>
 </nav>
 
 {% if docstring %}
 <div class="docstring">
   <h2> Description </h2>
   {{ docstring | safe_docstring_display | safe }}
 </div>
 {% endif %}
 {% if response_data  %}
 <div class="response-data">
   <h2>Request</h2>
   <pre><strong>{{ request.method }}</strong> {{ request.build_absolute_uri }}</pre>
   <hr/>
   <h2>Response</h2>
   {% if status_code != 200 %}
   <h3>Status Code</h3>
   <pre class="error">{{ status_code }}</pre>
   {% endif %}
   {% if headers_data %}
   <h3>Headers</h3>
     {% for header_name, header_value in headers_data.items %}
       <pre><strong>{{ header_name }}</strong> {{ header_value | urlize_header_links | safe }}</pre>
     {% endfor %}
   {% endif %}
     <h3>Body</h3>
-    {{ response_data | highlight_json | urlize_api_links | safe }}
+    <pre>
+      <code class="json">{{ response_data | urlize_api_links | safe }}</code>
+    </pre>
 </div>
 {% endif %}
 <hr/>
 {% if urls and urls|length > 0 %}
 <div class="doc-urls">
   <table class="m-x-auto table">
     <thead>
       <tr>
 	<th>URL</th>
 	<th>Allowed Methods</th>
       </tr>
     </thead>
     <tbody>
       {% for url in urls %}
       <tr>
 	<td>
 	  {{ url.rule }}
 	</td>
 	<td>
 	  {{ url.methods | dictsort:0 | join:', ' }}
 	</td>
       </tr>
       {% endfor %}
     </tbody>
   </table>
 </div>
 <hr/>
 {% endif %}
 {% if args and args|length > 0 %}
 <div class="doc-args">
   <h2> Arguments </h2>
   <dl class="doc-argslist dl-horizontal">
     {% for arg in args %}
     <dt> {{ arg.name }}: {{ arg.type }} </dt>
     <dd> {{ arg.doc | safe_docstring_display | safe }} </dd>
     {% endfor %}
   </dl>
 </div>
 <hr/>
 {% endif %}
 {% if params and params|length > 0 %}
 <div class="doc-params">
   <h2> Parameters </h2>
   <dl class="doc-paramslist dl-horizontal">
     {% for param in params %}
     <dt> {{ param.name }}: {{ param.type }} </dt>
     <dd> {{ param.doc | safe_docstring_display | safe }} </dd>
     {% endfor %}
   </dl>
 </div>
 <hr/>
 {% endif %}
 {% if headers and headers|length > 0 %}
 <div class="doc-headers">
   <h2> Headers </h2>
   <dl class="doc-headers dl-horizontal">
     {% for header in headers %}
     <dt> {{ header.name }}: string </dt>
     <dd> {{ header.doc | safe_docstring_display | safe }} </dd>
     {% endfor %}
   </dl>
 </div>
 <hr/>
 {% endif %}
 {% if returns and returns|length > 0 %}
 <div class="doc-return">
   <h2> Returns </h2>
   <dl class="doc-return dl-horizontal">
     {% for return in returns %}
     <dt> {{ return.type }} </dt>
     <dd> {{ return.doc | safe_docstring_display | safe }} </dd>
     {% endfor %}
   </dl>
 </div>
 <hr/>
 {% endif %}
 {% if excs and excs|length > 0 %}
 <div class="doc-excs">
     <h2> Errors </h2>
     <dl class="doc-excslist dl-horizontal">
         {% for exc in excs %}
         <dt> {{ exc.exc }} </dt>
         <dd> {{ exc.doc | safe_docstring_display | safe }} </dd>
         {% endfor %}
     </dl>
 </div>
 <hr/>
 {% endif %}
 {% if examples and examples|length > 0 %}
 <div class="doc-example">
   <h2> Examples </h2>
   <dl class="doc-example dl-horizontal">
   {% for example in examples %}
     <dd>
       <a href="{{ example }}">{{ example }}</a>
     </dd>
   {% endfor %}
   </dl>
 </div>
 {% endif %}
 {% endblock %}
diff --git a/swh/web/templates/content.html b/swh/web/templates/content.html
index de06bd960..51cfd14e0 100644
--- a/swh/web/templates/content.html
+++ b/swh/web/templates/content.html
@@ -1,29 +1,48 @@
 {% extends "layout.html" %}
+{% load static %}
+
+{% block header %}
+<script src="{% static 'js/highlightjs/dist/highlight.pack.js' %}"></script>
+<script src="{% static 'js/highlightjs-line-numbers/dist/highlightjs-line-numbers.min.js' %}"></script>
+<script>
+  // empty hljs language definition
+  function no_highlight(hljs) {
+    return {}
+  }
+  // just a trick to get line numbers working when no highlight
+  // has to be performed
+  hljs.registerLanguage('nohighlight-swh', no_highlight);
+  hljs.initHighlightingOnLoad();
+  hljs.initLineNumbersOnLoad();
+</script>
+<link rel="stylesheet" href="{% static 'css/highlightjs/github.css' %}">  
+{% endblock %}
+
 {% block title %}Content display{% endblock %}
 
 {% block content %}
 
 <div class="well well-sm">
   <b>Content mime type:</b> {{ mime_type }} , <b>Hashing algorithm:</b> {{ content_hash_algo}} , <b>Content checksum:</b> {{ content_checksum }} 
   <a href="{{ content_raw_url }}" class="btn btn-link btn-xs navbar-right" role="button">Raw File</a>
 </div>
 
 {% include "content-directory-top-navigation.html" %}
 
 <div class="well well-sm">
 {% if "inode/x-empty" == mime_type %}
 <i>File is empty</i>
 {% elif "text/" in mime_type %}
 <div class="highlightjs">
   <pre>
     <code class="{{ language }}">{{ content }}</code>
   </pre>
 </div>
 {% elif "image/" in mime_type and content %}
   <img src="data:{{ mime_type }};base64,{{ content }}"/>
 {% else %}
 Content with mime type {{ mime_type }} can not be displayed
 {% endif %}
 </div>
 
 {% endblock %}
diff --git a/swh/web/templates/layout.html b/swh/web/templates/layout.html
index bea313451..0ea0a6fd8 100644
--- a/swh/web/templates/layout.html
+++ b/swh/web/templates/layout.html
@@ -1,90 +1,79 @@
 <!DOCTYPE html>
 {% load static %}
 <html lang="en">
   <head>
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <title>{% block title %}{% endblock %}</title>
+
+    {% block header %}{% endblock %}
+
     <!-- BEGIN: bootstrap -->
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">    
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">
     
     <link rel="stylesheet" href="{% static 'css/bootstrap-responsive.min.css' %}">
     <link rel="stylesheet" href="https://cdn.datatables.net/1.10.13/css/jquery.dataTables.min.css" />
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" />
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
     <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
     <script src="https://cdn.datatables.net/1.10.13/js/jquery.dataTables.min.js"></script>
     <!-- END: bootstrap -->
 
-    <script src="{% static 'js/highlightjs/dist/highlight.pack.js' %}"></script>
-    <script src="{% static 'js/highlightjs-line-numbers/dist/highlightjs-line-numbers.min.js' %}"></script>
-    <script>
-      // empty hljs language definition
-      function no_highlight(hljs) {
-        return {}
-      }
-      // just a trick to get line numbers working when no highlight
-      // has to be performed
-      hljs.registerLanguage('nohighlight-swh', no_highlight);
-      hljs.initHighlightingOnLoad();
-      hljs.initLineNumbersOnLoad();
-    </script>
-    <link rel="stylesheet" href="{% static 'css/highlightjs/github.css' %}">
     <link rel="stylesheet" href="{% static 'css/pygment.css' %}">
     <link rel="stylesheet" type="text/css" href="{% static 'css/style.css' %}" />
     <link rel="icon" href="{% static 'img/icons/swh-logo-32x32.png' %}" sizes="32x32" />
     <link rel="icon" href="{% static 'img/icons/swh-logo-archive-192x192.png' %}" sizes="192x192" />
     <link rel="apple-touch-icon-precomposed" href="{% static 'img/icons/swh-logo-archive-180x180.png' %}" />
     <meta name="msapplication-TileImage" content="{% static 'img/icons/swh-logo-archive-270x270.png' %}" />
     <script>document.domain = "softwareheritage.org";</script>
 
   </head>
   <body>
     <a id="top"></a>
     <div class="jumbotron" style="z-index: 1;">
       <nav class="navbar navbar-default" id="swh-navbar-collapse">
         <div class="navbar-header">
           <button type="button" class="navbar-toggle collapsed"
                   data-toggle="collapse" data-target="#swh-navbar-collapse" aria-expanded="false"> <!-- screen-reader -->
 	    <span class="sr-only">Toggle navigation menu</span>
             <span class="icon-bar"></span>
             <span class="icon-bar"></span>
             <span class="icon-bar"></span>
           </button>
           <div class="logo">
             <a class="navbar-brand" href="{% url 'api_homepage' %}"> <!-- logo -->
               <img alt="SWH Archive" src="{% static 'img/swh-logo-archive.png' %}" class="swh-logo" />
             </a>
             <a class="navbar-brand sitename" href="{% url 'api_homepage' %}">
               <span class="first-word">Software</span> <span class="second-word">Heritage</span>
             </a>
           </div>
         </div>
       </nav>
     </div>
     <div class="container">
       <div class="container">
       </div>
       <div class="container content">
         {% block content %}{% endblock %}
       </div>
     </div>
     <div id="footer" class="panel-footer">
       <a href="https://www.softwareheritage.org">Software Heritage</a> &mdash;
       Copyright (C) 2015&ndash;2017, The Software Heritage developers.
       License: <a href="https://www.gnu.org/licenses/agpl.html">GNU
       AGPLv3+</a>. <br /> The source code of Software Heritage <em>itself</em>
       is available on
       our <a href="https://forge.softwareheritage.org/">development
       forge</a>. <br /> The source code files <em>archived</em> by Software
       Heritage are available under their own copyright and licenses. <br />
       Contact: see
       our <a href="https://www.softwareheritage.org/contact/">contact page</a>.
     </div>
     <div id="back-to-top">
       <a href="#top"><img alt="back to top" src="{% static 'img/arrow-up-small.png' %}" /></a>
     </div>
   </body>
 </html>